<!DOCTYPE html>
<html>

<head>

    {include file="Public/header"}
    <!-- jqgrid-->
    <link href="__STATIC__/layout/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">
     <link rel="stylesheet" href="__STATIC__/layout/css/demo.css" type="text/css">
    <link href="__STATIC__/layout/css/gyq.css" rel="stylesheet">
    <style>
        select.form-control {
            width: 150px;
            height: 22px;

        }

        input[type="text"] {
            height: 22px;
            width: 150px
        }

        /*#select2 option[checked="checked"]{background: #fff}*/

        select:-internal-list-box option:checked {
            background: #fff
        }

        p {
            color: red
        }
    </style>
</head>

<body class="white-bg" style="color:#333;padding:3px;">
      <div class="page-heade">
       <h2 class="title_color text-center">维护系统-修改</h2>
    </div>
    <table class="table table-bordered">
        <tr>
            <td>经销商名称：<span>广东省广州市博洁商贸有限公司</span>经销商编号：<span>201312313</span></td>
        </tr>
    </table>
<form action="" class="form-group" class="form-inline">
    <table class="table table-bordered" style="margin-bottom:0">
        <tr>
            <td style="width: 30%">
                模糊查询：未供货系统<input type="text" class="form-control" style="display: inline-block;">
                <button class="btn btn-sm btn-primary">查询</button>
                <button class="btn btn-sm btn-primary">清空查询条件</button>
            </td>
            <td style="width: 20%"></td>
            <td  style="width: 30%">
                模糊查询：现供货系统<input type="text" class="form-control" style="display: inline-block;">
                <button class="btn btn-sm btn-primary">查询</button>
                <button class="btn btn-sm btn-primary">清空查询条件</button>
            </td>
        </tr>
        <tr>
            <td style="padding: 1px">
                <div  style="line-height: 30px;text-align: center;" class="title_color">未供货系统</div>
                <div style="height: 400px;padding: 0">
                    <select multiple id="select1" name="select1" style="height: 100%;width: 100%;padding: 0" class="form-control">
                        {volist name="leftData" id="row"}
                        <option value="{$row.id}" style="padding: 3px 2px;">{$row.title}</option>
                        {/volist}
                    </select>
                </div>
            </td>
            <td class="text-center">
                <button class="btn btn-info" type="button" id="toRight">&gt;&gt;&gt;&gt;&gt;&gt;</button><br><br>
                <button class="btn btn-info" type="button" id="toLeft">&lt;&lt;&lt;&lt;&lt;&lt;</button>
            </td>
            <td style="padding:1px">
                <div style="line-height: 30px;text-align: center;" class="title_color">现供货系统
                </div>
                <div style="height:400px;padding: 0">
                    <select multiple id="select2" name="select2" style="height: 100%;width: 100%;padding: 0" class="form-control">

                        {volist name="rightData" id="row"}
                        <option value="{$row.id}" style="padding:3px 2px;">{$row.title}</option>
                        {/volist}

                    </select>
                </div>
            </td>
        </tr>
    </table>
    <div class="text-center padding-10">
        <button class="btn btn-warning" onclick="back()">返回</button>
    </div>
</form>

<!-- 全局js -->
{include file="Public/footer"}

<script src="__STATIC__/layout/js/plugins/sweetalert/sweetalert.min.js"></script>
<script>
    $(document).ready(function () {
        $('#toRight').click(function () {
            var $options = $('#select1 option:selected'); //获取选中的元素
            var arr = [];
            $options.each(function (i, o) {
                arr.push($(o).val())
            })
            arr = arr.join(',')
            var $remove = $options.remove();

            $.ajax({
                type: 'post',
                url: '{:url("batchSet")}',
                data: {pid: '{$id}', id: arr},
                dataType: 'json',
                success: function (data) {
                    if (data.success == false) {
                        swal(data.msg, '', 'error')
                    } else {
                        $remove.appendTo('#select2');
                    }
                }
            })
        });
        $('#toLeft').click(function () {
            var $options = $('#select2 option:selected'); //获取选中的元素
            var arr = [];
            $options.each(function (i, o) {
                arr.push($(o).val())
            })
            arr = arr.join(',')
            var $remove = $options.remove();

            $.ajax({
                type: 'post',
                url: '{:url("batchSet2")}',
                data: {pid: '{$id}', id: arr},
                dataType: 'json',
                success: function (data) {
                    if (data.success == false) {
                        swal(data.msg, '', 'error')
                    } else {
                        $remove.appendTo('#select1');
                    }
                }
            })
        });

    })

    function back() {
        parent.layer.close(parent.layer.getFrameIndex(window.name))
    }
</script>

</body>

</html>